<template>
	<view class="zxc_centent">
		<view class="big_box">   
		
	
		<view class="ik" style="margin-bottom:20upx;">
		<view class="ik_sm" @click="upload">
			<view class="ik_sm_left">
				头像
			</view>
			<view class="ik_sm_right">
				<image :src="headimgurl" class="tou_img"></image>
			</view>
		</view>
			<view class="ik_sm">
				<view class="ik_sm_left">
					昵称
				</view>
				<view class="ik_sm_right"> 
				<u-input type="text" class="input" v-model="userName" placeholder="请输入昵称"/>
				</view>
			</view>
		</view>
		
				<view class="ik">
					<view class="ik_sm">
						<view class="ik_sm_left">
							绑定手机号(关联会员卡)
						</view>
						<view class="ik_sm_right">
							<!-- <view>15088888888</view> -->
							<navigator url="/pagesA/set/bindtel" hover-class="none">暂未绑定</navigator>
							<image src="../../static/images/right.png" class="right_img" mode="widthFix"></image>
						</view>
					</view>
			<navigator hover-class="none" url="/pagesA/set/changetel" class="ik_sm">
				<view class="ik_sm_left">
					更改手机号
				</view>
				<view class="ik_sm_right">
					<image src="../../static/images/right.png" class="right_img" mode="widthFix"></image>
				</view>
			</navigator>
					<view class="ik_sm" @click="nav">
						<view class="ik_sm_left">
							更改会员卡支付密码
						</view>
						<view class="ik_sm_right"> 
							<view>已设置</view>
							<image src="../../static/images/right.png" class="right_img" mode="widthFix"></image>
						</view>
					</view>
				</view>
				
				<view class="ik" style="margin-top:20upx;">
					<view class="ik_sm" @click="loginoff">
						<view class="ik_sm_left">
							注销账户
						</view>
						<view class="ik_sm_right">
							<image src="../../static/images/right.png" class="right_img" mode="widthFix"></image>
						</view>
					</view>
				</view>
			
	
			
			
			<view class="jv" @click="loginout">退出当前账号</view>
			
		</view>
	</view>
</template>

<script>

	export default{

		data (){
			return {
				fileSizeString:'',
				token:'',
				actionUrl:'',
				fileip:'',
				userName:'',
				headimgurl:'',
			}
		},
		onLoad (){
			this.headimgurl = uni.getStorageSync('headimgurl')
			this.userName = uni.getStorageSync('customerName')
			this.fileip=this.$api.ipimg;   //设置文件ip地址
			this.actionUrl=this.$api.actionUrls;   //设置请求地址,多文件上传接口
			var token =uni.getStorageSync('token');
			this.token=token;
		},
		methods:{
			loginoff (){
				uni.navigateTo({
					url:'/pagesA/set/logoff'
				})
			},
			nav (){
				uni.navigateTo({
					url:'/pagesA/set/changepaypasswordone'
				})
			},

			// 上传图片
			// 点击上传图片
			upload() {
				var _this=this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					loop: true,
					success: res => {
					
						var tempFilePaths = res.tempFilePaths;
						console.log(tempFilePaths);
						
						for (let i = 0; i < tempFilePaths.length; i++) { //多图上传
					
						
						uni.uploadFile({
							url: _this.actionUrl,
							filePath: tempFilePaths[i],
							header:{
								'Authorization':_this.token
							},
							name: 'file',
							success: uploadFileRes => {
								console.log('上传图片', JSON.parse(uploadFileRes.data));
								var data=JSON.parse(uploadFileRes.data)
								_this.imgList.push(data.data.fileName);
							
							},
							fail(err) {
								console.log(err);
							}
						});
						}
					}
				}); 
			},
			
			// 删除图片
			del(index) {
				this.imgList.splice(index, 1);
				console.log(this.imgList);
			},
			 loginout (){
			 	uni.showModal({
			 		title: '提示',
			 		content: '确定要退出吗？',
			 		success: function (res) {
			 			if (res.confirm) {
			 				console.log('用户点击确定');
			 			} else if (res.cancel) {
			 				console.log('用户点击取消');
			 			}
			 		}
			 	});
			 }
			
		}
	}
</script>

<style lang="scss">
	::v-deep .u-radio{
		margin-left:30upx;
	}
	.big_box{
		width:100%;
		margin:0 auto;
	}
.ik{
		padding:0 30upx;
		background-color: #FFF;
	}
	.ik_sm{
		padding:30upx 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-bottom:1px solid #ededed;
		font-size:28upx;
	}
	.ik_sm_right{
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
	.input{
		width:300upx;
		height:50upx;
		text-align: right;
		font-size:28upx;
	}
	.tou_img{
		width:100upx;
		height:100upx;
		border-radius: 100upx;
	}
	.right_img{
		width:15upx;
		margin-left:20upx;
	}
	.re_img{
		width:30upx;
		margin-left:20upx;
	}
	.ole{
		padding:20upx 0;
	}
	.jv{
		background-color: #fff;
		color:#000;
		text-align: center;
		padding:30upx 0;
		width:100%;
		margin:20upx auto;
	}
	.label{
		font-size:28upx;
		margin:10upx 0 20upx 0;
		font-weight: 700;
	}
	.input{
		width:300upx;
		height:50upx;
		text-align: right;
		font-size:28upx;
	}
</style>